@extends('WShop::layout')

@push('styles')
    <link href="{{asset(config('view.frontend.wap_login').'/css/mui.picker.css')}}" rel="stylesheet" />
    <link href="{{asset(config('view.frontend.wap_login').'/css/mui.poppicker.css')}}" rel="stylesheet" />
@endpush
@section('content')
    @component('WShop::public.header')
        @slot('page_title'){{$page_title}} @endslot
    @endcomponent
    <div class="mui-content mui-scroll-wrapper" id="pullrefresh">
        <div class="mui-scroll">

            <div class="mui-table-view mui-table-view-chevron mui-bottom mui-password">
                <div class="flex">
                    <div class="flex-item mui-text-center" style="display: none">余额转换</div>
                    <div class="flex-item mui-text-center color1">会员互转</div>
                </div>
                <div style="display: none" class="mui-user-xx ">
                    <form class="form1"  action="{{route('f_Wap_Account_transfer',['in_or_out'=>'in'])}}">
                        {{csrf_field()}}
                        <ul class="mui-table-view bg-fff">
                            <li class="mui-table-view-cell" style="margin-bottom: 0!important;">
                                <a class="mui-clearfix" href="javascript:;" style="float: left;width: 25%;">
                                    <img src="{{asset(config('view.frontend.wap_login').'/images/wallet.png')}}" alt="" width="12" class="mui-pull-left" />
                                    <div class="mui-pull-left">
                                        <div>{{get_currency()['money2']}}</div>
                                        <div class="mui-text-red" style="font-size: 12px;">{{$wallet->money2}}</div>
                                    </div>
                                </a>
{{--                                <a class="mui-clearfix" href="javascript:;" style="float: left;width: 25%;">--}}
{{--                                    <img src="{{asset(config('view.frontend.wap_login').'/images/wallet.png')}}" alt="" width="12" class="mui-pull-left" />--}}
{{--                                    <div class="mui-pull-left">--}}
{{--                                        <div>{{get_currency()['money1']}}</div>--}}
{{--                                        <div class="mui-text-red" style="font-size: 12px;">{{$wallet->money1}}</div>--}}
{{--                                    </div>--}}
{{--                                </a>--}}

{{--                                <a class="mui-clearfix" href="javascript:;" style="float: left;width: 25%;">--}}
{{--                                    <img src="{{asset(config('view.frontend.wap_login').'/images/wallet.png')}}" alt="" width="12" class="mui-pull-left" />--}}
{{--                                    <div class="mui-pull-left">--}}
{{--                                        <div>{{get_currency()['money3']}}</div>--}}
{{--                                        <div class="mui-text-red" style="font-size: 12px;">{{$wallet->money3}}</div>--}}
{{--                                    </div>--}}
{{--                                </a>--}}

{{--                                <a class="mui-clearfix" href="javascript:;" style="float: left;width: 25%;">--}}
{{--                                    <img src="{{asset(config('view.frontend.wap_login').'/images/wallet.png')}}" alt="" width="12" class="mui-pull-left" />--}}
{{--                                    <div class="mui-pull-left">--}}
{{--                                        <div>{{get_currency()['money4']}}</div>--}}
{{--                                        <div class="mui-text-red" style="font-size: 12px;">{{$wallet->money4}}</div>--}}
{{--                                    </div>--}}
{{--                                </a>--}}

                            </li>

                            <div class="input1">
                                <p style="background-color: #E8EFFE;text-align: center;font-size: 14px;padding: 5px;color: #dd524d; margin-bottom: 0;">最低转换金额{{get_rule('tf_min')}}最大{{get_rule('tf_max')}}且必须为{{get_rule('tf_mul')}}的整数倍转换比例{{json_decode(get_rule('tf_self_tax'))}}</p>
                            </div>

                            <li style="background: #f2f2f2;height: 10px;"></li>
                            <li class="mui-table-view-cell">
                                <div class="mui-input-row">
                                    <label style="width: 100px;margin-left: 5px;">转换金额：</label>
                                    <input type="text" name="money" class="mui-input-clear" value="">
                                </div>
                            </li>
                            <li class="mui-table-view-cell">
                                <div class="mui-input-row">
                                    <span style="width: 100px;margin-left: 5px;padding: 11px 15px;padding-left: 0;color: #333;font-family: 'Helvetica Neue', Helvetica, sans-serif;line-height: 1.1;float: left;">备注：</span>
                                    <textarea style="border: 1px solid #eee;" name="comment" ></textarea>
                                </div>
                            </li>
                        </ul>

                        <div class="mui-table-view mui-table-view-chevron mui-bottom">
                            <div class="mui-queren-dingdan ">
                        <ul class="mui-table-view mui-table-view-radio bg-fff zhifu" style="margin: 10px 0 0 0 ;">
{{--                            <li class="mui-table-view-cell">--}}
{{--                                <a href="javascript:;" class="mui-navigate-right">--}}
{{--                                    <input type="radio" name="pay_type"  value="201" />--}}
{{--                                    <span style="float: left;color: #5a92fd;margin-right: 30px;">--}}
{{--                                        <em>{{get_currency()['money2']}}</em>--}}

{{--                                    </span>--}}
{{--                                    <img src="{{asset(config('view.frontend.wap_login').'/images/right.png')}}" style="width: 50px;position: absolute;top: 20%;left: 40%;">--}}
{{--                                    <span style="float: right;color: #c51313b5;margin-right: 30px;">--}}
{{--                                        <em>{{get_currency()['money1']}}</em>--}}
{{--                                    </span>--}}
{{--                                </a>--}}
{{--                            </li>--}}

{{--                            <li class="mui-table-view-cell">--}}
{{--                                <a href="javascript:;" class="mui-navigate-right">--}}
{{--                                    <input type="radio" name="pay_type"  value="203" />--}}
{{--                                    <span style="float: left;color: #5a92fd;margin-right: 30px;">--}}
{{--                                        <em>{{get_currency()['money2']}}</em>--}}
{{--                                    </span>--}}
{{--                                    <img src="{{asset(config('view.frontend.wap_login').'/images/right.png')}}" style="width: 50px;position: absolute;top: 20%;left: 40%;">--}}
{{--                                    <span style="float: right;color: #c51313b5;margin-right: 30px;">--}}
{{--                                        <em>{{get_currency()['money3']}}</em>--}}
{{--                                    </span>--}}
{{--                                </a>--}}
{{--                            </li>--}}

{{--                            <li class="mui-table-view-cell">--}}
{{--                                <a href="javascript:;" class="mui-navigate-right">--}}
{{--                                    <input type="radio" name="pay_type"  value="204" />--}}
{{--                                    <span style="float: left;color: #5a92fd;margin-right: 30px;">--}}
{{--                                        <em>{{get_currency()['money2']}}</em>--}}
{{--                                    </span>--}}
{{--                                    <img src="{{asset(config('view.frontend.wap_login').'/images/right.png')}}" style="width: 50px;position: absolute;top: 20%;left: 40%;">--}}
{{--                                    <span style="float: right;color: #c51313b5;margin-right: 30px;">--}}
{{--                                        <em>{{get_currency()['money4']}}</em>--}}
{{--                                    </span>--}}
{{--                                </a>--}}
{{--                            </li>--}}

                        </ul>
                            </div>
                        </div>
                        <button type="button" class="mui-btns btns1" style="width: 100%;border-radius: 2px;"> 确定提交</button>
                    </form>
                </div>
                <div class="mui-user-xx mui-active ">
                    <form class="form2"  action="{{route('f_Wap_Account_transfer',['in_or_out'=>'out'])}}">
                        {{csrf_field()}}
                        <ul class="mui-table-view bg-fff">
                            <li class="mui-table-view-cell" style="margin-bottom: 0!important;">
                                <a class="mui-clearfix" href="javascript:;" style="float: left;width: 25%;">
                                    <img src="{{asset(config('view.frontend.wap_login').'/images/wallet.png')}}" alt="" width="12" class="mui-pull-left" />
                                    <div class="mui-pull-left">
                                        <div>{{get_currency()['money2']}}</div>
                                        <div class="mui-text-red" style="font-size: 12px;">{{$wallet->money2}}</div>
                                    </div>
                                </a>
{{--                                <a class="mui-clearfix" href="javascript:;"  style="float: left;width: 25%;">--}}
{{--                                    <img src="{{asset(config('view.frontend.wap_login').'/images/wallet.png')}}" alt="" width="12" class="mui-pull-left" />--}}
{{--                                    <div class="mui-pull-left">--}}
{{--                                        <div>{{get_currency()['money1']}}</div>--}}
{{--                                        <div class="mui-text-red" style="font-size: 12px;">{{$wallet->money1}}</div>--}}
{{--                                    </div>--}}
{{--                                </a>--}}
{{--                                <a class="mui-clearfix" href="javascript:;"  style="float: left;width: 25%;">--}}
{{--                                    <img src="{{asset(config('view.frontend.wap_login').'/images/wallet.png')}}" alt="" width="12" class="mui-pull-left" />--}}
{{--                                    <div class="mui-pull-left">--}}
{{--                                        <div>{{get_currency()['money3']}}</div>--}}
{{--                                        <div class="mui-text-red" style="font-size: 12px;">{{$wallet->money3}}</div>--}}
{{--                                    </div>--}}
{{--                                </a>--}}
{{--                                <a class="mui-clearfix" href="javascript:;"  style="float: left;width: 25%;">--}}
{{--                                    <img src="{{asset(config('view.frontend.wap_login').'/images/wallet.png')}}" alt="" width="12" class="mui-pull-left" />--}}
{{--                                    <div class="mui-pull-left">--}}
{{--                                        <div>{{get_currency()['money4']}}</div>--}}
{{--                                        <div class="mui-text-red" style="font-size: 12px;">{{$wallet->money4}}</div>--}}
{{--                                    </div>--}}
{{--                                </a>--}}
                            </li>

                            <div class="input1">
                                <p style="background-color: #E8EFFE;text-align: center;font-size: 14px;padding: 5px;color: #dd524d; margin-bottom: 0;">最低转换金额{{get_rule('tf_min')}}最大{{get_rule('tf_max')}}且必须为{{get_rule('tf_mul')}}的整数倍@if(get_rule('tf_tax')> 0 && get_rule('tf_tax') <100)，手续费{{get_rule('tf_tax')}}%@endif</p>
                            </div>

                            <li style="background: #f2f2f2;height: 10px;"></li>
                            <li class="mui-table-view-cell">
                                <div class="mui-input-row">
                                    <label style="width: 100px;margin-left: 5px;">转账金额：</label>
                                    <input type="text" name="money" class="mui-input-clear" value="">
                                </div>
                            </li>
                            <li class="mui-table-view-cell">
                                <div class="mui-input-row">
                                    <label style="width: 100px;margin-left: 5px;">转入账号：</label>
                                    <input type="text" name="to_number" class="mui-input-clear" value="">
                                </div>
                            </li>
                            <li class="mui-table-view-cell">
                                <div class="mui-input-row">
                                    <label style="width: 100px;margin-left: 5px;">支付密码：</label>
                                    <input type="password" name="password_safe" class="mui-input-clear" value="">
                                </div>
                            </li>
                            <li class="mui-table-view-cell">
                                <div class="mui-input-row">
                                    <span style="width: 100px;margin-left: 5px;padding: 11px 15px;padding-left: 0;color: #333;font-family: 'Helvetica Neue', Helvetica, sans-serif;line-height: 1.1;float: left;">备注：</span>
                                    <textarea style="border: 1px solid #eee;" name="comment" ></textarea>
                                </div>
                            </li>
                        </ul>

                        <div class="mui-table-view mui-table-view-chevron mui-bottom">
                            <div class="mui-queren-dingdan ">

                                <ul class="mui-table-view mui-table-view-radio bg-fff zhifu" style="margin: 10px 0 0 0;">

{{--                                    <li class="mui-table-view-cell">--}}
{{--                                        <a href="javascript:;" class="mui-navigate-right">--}}
{{--                                            <input type="radio" name="pay_type"  value="101" />--}}
{{--                                            <span style="float: left;color: #5a92fd;margin-right: 30px;">--}}
{{--                                        <em>{{get_currency()['money1']}}</em>--}}

{{--                                    </span>--}}
{{--                                            <img src="{{asset(config('view.frontend.wap_login').'/images/right.png')}}" style="width: 50px;position: absolute;top: 20%;left: 40%;">--}}
{{--                                            <span style="float: right;color: #c51313b5;margin-right: 30px;">--}}
{{--                                        <em>{{get_currency()['money1']}}</em>--}}
{{--                                    </span>--}}
{{--                                        </a>--}}
{{--                                    </li>--}}
                                    <li class="mui-table-view-cell mui-selected">
                                        <a href="javascript:;" class="mui-navigate-right">
                                            <input type="radio" name="pay_type" checked value="202" />
                                            <span style="float: left;color: #5a92fd;margin-right: 30px;">
                                        <em>{{get_currency()['money2']}}</em>

                                    </span>
                                            <img src="{{asset(config('view.frontend.wap_login').'/images/right.png')}}" style="width: 50px;position: absolute;top: 20%;left: 40%;">
                                            <span style="float: right;color: #c51313b5;margin-right: 30px;">
                                        <em>{{get_currency()['money2']}}</em>
                                    </span>
                                        </a>
                                    </li>

{{--                                    <li class="mui-table-view-cell">--}}
{{--                                        <a href="javascript:;" class="mui-navigate-right">--}}
{{--                                            <input type="radio" name="pay_type"  value="404" />--}}
{{--                                            <span style="float: left;color: #5a92fd;margin-right: 30px;">--}}
{{--                                        <em>{{get_currency()['money4']}}</em>--}}

{{--                                    </span>--}}
{{--                                            <img src="{{asset(config('view.frontend.wap_login').'/images/right.png')}}" style="width: 50px;position: absolute;top: 20%;left: 40%;">--}}
{{--                                            <span style="float: right;color: #c51313b5;margin-right: 30px;">--}}
{{--                                        <em>{{get_currency()['money4']}}</em>--}}
{{--                                    </span>--}}
{{--                                        </a>--}}
{{--                                    </li>--}}

                                </ul>
                            </div>
                        </div>

                        <button type="button" class="mui-btns btns2" style="width: 100%;border-radius: 2px;"> 确定提交</button>
                    </form>
                </div>
            </div>
        </div>
    </div>
@endsection
@push('scripts')
    <script src="{{asset(config('view.frontend.wap_login').'/js/mui.picker.js')}}"></script>
    <script src="{{asset(config('view.frontend.wap_login').'/js/mui.poppicker.js')}}"></script>
    <script>
        $('.btns1')[0].addEventListener('tap',function(){
            var data=$('.form1').serialize();
            var url = $('.form1').attr('action')
            sendTf(data,url)
            return true;
        })
        $('.btns2')[0].addEventListener('tap',function(){
            var data=$('.form2').serialize();
            var url = $('.form2').attr('action')
            sendTf(data,url)
            return true;
        })
        var a=$('.mui-password .flex .flex-item')
        for(var i=0;i<a.length;i++){
            a[i].addEventListener('tap',function(){
                $(this).addClass('color1').siblings().removeClass('color1')
                var b=$(this).index()
                $($('.mui-user-xx')[b]).addClass('mui-active').siblings().removeClass('mui-active')
            })
        }
    </script>
    <script>
        function sendTf(data,url)
        {
            $.ajax({
                type: 'post',
                url: url,
                dataType: 'json',
                data: data
            }).done(function (response) {
                if(response.status){
                    mui.toast(response.msg);
                    setTimeout(function () {
                        location.href = response.url;
                    }, 2000);
                }else{
                    mui.toast(response.msg);
                }
            }).fail(function (XMLHttpRequest) {
                if (XMLHttpRequest.status == 422) {
                    var errors = XMLHttpRequest.responseJSON.errors;
                    if(typeof errors == 'object') {
                        for (var index in errors) { // 不推荐这样
                            mui.toast(errors[index][0]);
                            break;
                        }
                    }else{
                        mui.toast(XMLHttpRequest.responseJSON.msg);

                    }
                }else{
                    mui.toast('网络异常,请检查连接');
                }

            }).always(function () {

            });
        }
    </script>
@endpush